<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<title>JavaScript: The Good Parts - Function</title>
		<style type="text/css">
			div#header {
				color: #0066FF;
				font-size: 25pt;
			}
			
			div#content {
				color: #B088FF;
				font-size: 12pt;
			}
		</style>
		
		<!-- embed jquery by google，藉由google嵌入jquery 1.6.2 -->
		<script type="text/javascript" src="http://www.google.com/jsapi"></script>
		<script type="text/javascript" language="javascript">
			google.load( "jquery", "1.6.2" );
		</script>
		<script type="text/javascript">
			
			/****************************************************************************
			在javascript中，函式的呼叫有四種方式:
			此示範第二種，函式呼叫模式(function invocation pattern)
			****************************************************************************/
			
			// javascript物件實字，該物件在<script>標籤被載入時，就已經被初始化
			var myObject = {
				value: 0,
				
				// javascript物件的method
				increment: function( inc ) {
					if( typeof( inc ) === "number" ) {
					
						// this參照指向myObject物件
						this.value += inc;
					} else {
						this.value += 1;
					}
				},
				showMessage: function() {
					alert( "initialize myObject now... " );
				}
			};
			
			var add = function( a, b ) {
				var returnValeu = a + b;
				return returnValeu;
			};
			
			myObject.double = function() {
				var that = this;
				var helper = function() {
					// 呼叫add()函式，並將回傳值指派給外層函式的this參照的value特性
					that.value = add( that.value, that.value );
				};
				
				helper();  // 把helper似為函式呼叫
			};
		
			$( document ).ready( function() {
				var $content = $( "#content" );
				
				if( myObject != null && typeof( myObject ) == "object" ) {
					$content.append(
						"myObject is not null and typeof(myObject) is " + typeof( myObject ) + "<br />" + 
						"myObject.value is <b>" + myObject.value + "</b><br />"
					);
				}
				
				$content.append( "Before increment() value is <b>" + myObject.value + "</b><br />" );
				
				myObject.increment( 500 );  // 呼叫物件的method，並傳入引數
				$content.append( "After increment( 500 ) value is <b>" + myObject.value + "</b><br />" );
				
				myObject.double();  // 把double似為函式呼叫
				$content.append( 
					"After myObject.double(), value is <b>" + myObject.value + "</b><br />"
				);
			});
		</script>
		
	</head>
	
	<body>
		<div title="Chapter04" id="header">JavaScript: The Good Parts - Ch04 Function</div>
		<div title="lab" id="content"></div>
	</body>
</html>